<!DOCTYPE html>
<html>
<head>
    <#include "/common/import.ftl" >
    <!-- css import -->
    <link href="${ctx!''}/js/jquery-validation/milk.css" type="text/css" rel="stylesheet"/>
    <script type="text/javascript" src="${ctx}/js/jquery-md5-min.js"></script>
    <script>
        var thsTitle = "系统登录";
    </script>
    <style>
        .inputForm {
            padding: 0 30px;
        }

        .inputForm .form-group:last-child {
            margin-top: 25px;
        }

        .login_btn {
            margin: 30px 15px 0 15px;
            border-top: 1px solid #ddd;
            color: #a5a8aa;
            padding: 20px 15px 0 15px;
            font-size: 14px;
        }

        .login_btn a {
            color: #a5a8aa
        }

        .login_btn button {
            background: #1169af;
            color: #fff;
            border-radius: 5px;
        }

        .login-part {
            margin: auto 0;
            background: #fefefe;
            /*border: 1px solid #eaeaea;*/
            box-shazdow: 1px 1px 1px #eaeaea;
            position: absolute;
            left: 50%;
            top: 25%;
            transform: translate(-50%, -50%);
        }

        .user-info {
            padding: 0 30px;
        }

        .user-pass form {
            margin: 0;
            padding: 0;
            padding-right: 8px;
        }

        .user-name,
        .pass-word {
            background: #fff;
            display: block;
            width: 100%;
            padding: 4px 0;
            /*border: 2px solid #e1e1e1;*/
            margin-bottom: 20px;
            font-weight: normal;
            /*text-indent:43px;*/
            outline: 0;
            font-size: 1.25em;
            line-height: 20px;
        }

        input {
            height: 20px;
            border: 2px solid #e1e1e1;
        }

        .error-mess {
            background: #fff0f0;
            border: 1px solid #ffd2d2;
            height: 20px;
            line-height: 20px;
            margin-top: 10px;
            color: #b74d46;
            width: 100%;
        }

        .error-mess .error-icon {
            display: inline-block;
            background: url("../images/login-logic-icons.png") no-repeat 0 0;
            width: 16px;
            height: 16px;
            vertical-align: middle;
            margin: -4px 5px 0 5px;
        }
    </style>
</head>
<body>
<body class="easyui-layout" style="overflow-y: hidden" scroll="no">
<div region="north" border="false" style="height: 80px; background: #a8d7e9;">
    <div id="top" class="top" region="north" border="false">
        <span style="float: left; line-height: 66px; font-size: 30px; font-family: 微软雅黑; color: #000000; text-shadow: 5px 5px 5px #0c4b09">&nbsp;&nbsp;&nbsp;&nbsp;RPC服务统一管理控制台</span>
    </div>
</div>
<div id="mainPanle" region="center" style="overflow: hidden;">
    <div class="login-user col-xs-12 col-sm-6 col-md-5 col-lg-5">
        <div class="login-part">
            <span style="line-height: 30px; font-size: 20px; font-family: 微软雅黑; ">帐号登录</span>
            <div class="user-info">
                <div class="user-pass">
                    <form name="inputForm" class="inputForm">
                        <div class="user-name">
                            用户名：
                            <input id="userEname2" tabindex="1" size="50"
                                   placeholder="输入用户名" type="text" value=""/>
                        </div>

                        <div class="pass-word">
                            密&nbsp;&nbsp;&nbsp;码：
                            <input id="upass" tabindex="2" placeholder="输入密码"
                                   type="password" size="50" autocomplete="off"/>
                        </div>
                        <div class="error-mess" id="error-mess" style="display: none;">
                            <span class="error-icon"></span>
                            <span id="error-message"></span>
                        </div>
                        <a href="#" class="easyui-linkbutton"
                           onClick="login(_ctx);">登&nbsp;&nbsp;录</a>
                    </form>
                    <form id="loginform">
                        <input name="userName" type="hidden" id="userEname"/>
                        <input name="password" type="hidden" id="userPass"/>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 正文结束 -->
<script>
    function login() {
        var uname = $('#userEname2').val();
        var upass = $('#upass').val();
        if (uname == null || uname == "") {
            setErrMsg('请输入用户名');
            $('#userEname2').focus();
            return;
        }
        if (upass == null || upass == "") {
            setErrMsg('请输入密码');
            $('#upass').focus();
            return;
        }
        $("#userEname").val(uname);
        $("#userPass").val(upass.md5());
        $.ajax({
            type: 'post',
            url: '${ctx!''}/main/login',
            data: $("#loginform").serialize(),
            dataType: 'json',
            success: function (myData) {
                if (myData.flag == "T") {
                    window.location = "${ctx!''}/index";
                } else {
                    alert(myData.msg);
                }
            }
        });
    }

    function setErrMsg(msg) {
        $("#error-mess").css('display', 'none');
        $("#error-mess").toggle();
        $("#error-message").html(msg);
    }
</script>
</body>

</html>